import React from 'react'
import Product from '../../../component/product/product'
import HomeCss from './home.module.scss'
import axios from 'axios'
import {ProductInterface} from '../../../types/product'

interface Istate{
    list:ProductInterface[]
}

export default class Home extends React.Component<{},Istate> {
    state = {
        list:[]
    }
    componentDidMount(){
        axios.get('/api/list').then(res => {
            console.log(res)
            this.setState({
                list:res.data.list
            })
        })
    }
    render() {
        let {list} = this.state;
        return (
            <div className={HomeCss.wrap}>
                {list&& list.map((item:ProductInterface) => <Product key={item.id} item={item}></Product>)}
            </div>
        )
    }
}
